import React, { useState } from 'react'
import { Breadcrumb } from 'antd';
import { HashRouter, Link, Route, Routes, useLocation } from 'react-router-dom';
import { useEffect } from 'react';
import api from '../../aips/role'
import menu from '../../aips/menu'

export default function Bread() {
    const lost = useLocation()
    const [path, setPath] = useState({})
    const [pathone, setPathone] = useState([])
    useEffect(() => {
        const nnn = lost.pathname.split('/')
        const one = `/${nnn[1]}`
        const two = `/${nnn[2]}`
        api.menu().then(res => {
            res.rows.children.filter(item => {
                if (item.path == one) {
                    setPathone(item)
                    if(item.children){
                        item.children.filter(child=>{
                            if(child.path==`${one}${two}`){
                                setPath(child)
                            }
                        })
                    }
                }
            })
        })
    }, [])
    return (
        <div>
            <Breadcrumb>
                <Breadcrumb.Item>
                   <Link to={'/home'}> 主页</Link>
                </Breadcrumb.Item>
                <Breadcrumb.Item>
                    <Link to={pathone.path}>{pathone.title}</Link>
                </Breadcrumb.Item>
                <Breadcrumb.Item>
                <Link to={path.path}>{path.title}</Link>
                </Breadcrumb.Item>
            </Breadcrumb>
        </div>
    )
}
